<template>
  <div>
    <el-row>
      <el-col :span="16">
    <el-form ref="form" :model="form" :inline="true" style="text-align: left;height: 38px">
      <el-form-item>
        <el-input v-model="form.filter.kwd" style="float: left;" placeholder="请输入受试者号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" style="float: left;" @click.native="onSubmit"><i class="el-icon-search"></i>查询
        </el-button>
      </el-form-item>
      <el-form-item>
        <el-button v-if="$utils.ckUIPower('S01010101')&&currentStatus==1" @click="changeSubjectActives"
                   style="float: left;" :disabled="editClick">
          批量完成试验
        </el-button>
      </el-form-item>
    </el-form>
    </el-col>

    <el-col :span="8">
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="page.pageNumber"
          :page-sizes="[10, 20, 30]"
          :page-size="10"
          layout="total, prev, pager, next, jumper"
          :total="page.totalRow">
        </el-pagination>
      </div>
    </el-col>
    </el-row>
    <div>
      <el-table stripe
                v-loading="loading"
                element-loading-text="数据加载中"
                :data="page.list"
                style="width:100%"
                @sort-change="onSubmit"
                @selection-change="handleSelectionChange"
                border>
        <el-table-column
          inline-template
          fixed
          label="序号"
          width="80px"
          align="center">
          <span>{{$index + 1 + ((page.pageNumber - 1) * page.pageSize)}}</span>
        </el-table-column>
        <!--<el-table-column-->
          <!--property="num"-->
          <!--fixed-->
          <!--sortable="custom"-->
          <!--label="受试者号"-->
          <!--width="120px"-->
          <!--align="center">-->
        <!--</el-table-column>-->

        <el-table-column
          type="selection"
          width="55">
        </el-table-column>

        <el-table-column
          property="candidateNum"
          sortable="custom"
          label="筛选号"
          width="100px"
          align="center">
        </el-table-column>
        <el-table-column
          label="随机号"
          property="randomNum"
          sortable="custom"
          width="100px"
          align="center">
        </el-table-column>
        <el-table-column
          label="姓名"
          property="name"
          sortable="custom"
          width="150px"
          align="center">
        </el-table-column>
        <el-table-column
          property="sex"
          sortable="custom"
          label="性别"
          width="100px"
          align="center">
        </el-table-column>
        <el-table-column
          property="passTime"
          sortable="custom"
          label="通过筛选时间"
          width="200px"
          align="center">
        </el-table-column>
        <el-table-column
          property="hospitalStatus"
          sortable="custom"
          inline-template
          label="住院状态"
          width="120px"
          align="center">
           <span style="white-space:nowrap;">
          {{hospitalStatusList[row.hospitalStatus].label}}
           </span>
        </el-table-column>
        <el-table-column
          property="testStatus"
          sortable="custom"
          inline-template
          label="试验状态"
          width="120px"
          align="center">
          <span style="white-space:nowrap;">
          {{testList[row.testStatus].label}}
          </span>
        </el-table-column>
        
        <el-table-column
          label="理论时间"
          width="100px"
          inline-template
          align="center">
          <template>
            <el-popover
              ref="timeDialog"
              placement="top"
              width="360px" key="timeDialog">
              <el-table :data="timeList" height="300" border stripe>
                <el-table-column width="160" property="name" label="试验环节" align="center"></el-table-column>
                <el-table-column width="80" property="cycles" label="周期" align="center"></el-table-column>
                <el-table-column width="180" label="理论时间" align="center"
                                 inline-template>
                  <template>
                    {{row.theoryTime!=undefined&&row.theoryTime!=null?row.theoryTime:'-'}}
                  </template>
                </el-table-column>
              </el-table>
            </el-popover>
            <el-button type="text" v-popover:timeDialog @click.native="openTimeDialog(row)">查看</el-button>
          </template>
        </el-table-column>
        <el-table-column
          inline-template
          label="操作"
          fixed="right"
          align="center"
          v-if="$utils.ckUIPower('S01010101')"
          width="290px">
          <template v-if="currentStatus==1">
            <el-button type="text" @click.native="openEditDialog(row)" key="update" >更新</el-button>
            <el-button type="text" @click.native="openRegisterDialog(row.id,row.hospitalStatus,row.finger)" key="register">
              {{row.hospitalStatus == 1 ? '出院登记' : '入院登记'}}
            </el-button>
            <el-button type="text" @click.native="openTagDialog(row)" key="printTarget">标签打印</el-button>
            <el-button type="text" @click.native="openTimeDialogTable(row)">时间记录表</el-button>
            <!--<el-button type="text" @click.native="openVisitDialogTable(row)">随访时间</el-button>-->
            <!--<el-button type="text" @click.native="openNumDialogTable(row)">添加随机号</el-button>-->
          </template>
        </el-table-column>
         <el-table-column
          inline-template
          label="查看化验单"
          fixed="right"
          align="center"
          v-if="$utils.ckUIPower('S01010101')"
          width="150px">
          <template v-if="currentStatus==1">
           
            <el-button type="text" @click.native="opensf(row.id)">随访期</el-button>
            <el-button type="text" @click.native="opensx(row.id)">筛选期</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-dialog
      title="随访期化验单查看"
      :visible.sync="dialogVisiblesf"
      width="30%"
      :before-close="handleClose">
          <el-table
            :data="afbeData"
            border
            style="width: 100%">
            <el-table-column
              prop="a"
              label="项目名称"
              width="width:50%">
            </el-table-column>
            <el-table-column
              prop="b"
              label="结果"
              width="width:50%">
            </el-table-column>
            
          </el-table>

          
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="colsess()">关 闭</el-button>
          </span>
    </el-dialog>
    <el-dialog
      title="筛选期化验单查看"
      :visible.sync="dialogVisiblesx"
      width="30%"
      :before-close="handleClose">
          <el-table
            :data="afbeData"
            border
            style="width: 100%">
            <el-table-column
              prop="a"
              label="项目名称"
              width="width:50%">
            </el-table-column>
            <el-table-column
              prop="b"
              label="结果"
              width="width:50%">
            </el-table-column>
            
          </el-table>
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="colsess()">关 闭</el-button>
          </span>
    </el-dialog>
    <!--<div class="block">-->
      <!--<el-pagination-->
        <!--@size-change="handleSizeChange"-->
        <!--@current-change="handleCurrentChange"-->
        <!--:current-page="page.pageNumber"-->
        <!--:page-sizes="[10, 20, 30]"-->
        <!--:page-size="10"-->
        <!--layout="total, prev, pager, next, jumper"-->
        <!--:total="page.totalRow">-->
      <!--</el-pagination>-->
    <!--</div>-->
    <edit-dialog :edit-dialog-visible="editDialog.show" @closeEditDialog="closeEditDialog" :subject-id="subjectId" ref="child"></edit-dialog>
    <!--登记弹框-->
    <register-dialog :register-dialog-visible="registerDialog.show"
                     @closeRegisterDialog="closeRegisterDialog"></register-dialog>
    <!--标签弹框-->
    <tag-dialog :tag-dialog-visible="tagDialog.show" @closeTagDialog="closeTagDialog" :subject-id="subjectId"
                :subject-num="subjectNum"></tag-dialog>
    <!--时间记录表弹框-->
    <time-dialog :time-dialog-visible="timeDialog.show"
                 :subject-id="subjectId"
                 :subject-num="subjectNum"
                 :proejct-id="projectId"
                 @closeTimeDialogTable="closeTimeDialogTable"></time-dialog>
    
  </div>
</template>
<script>
  import EditDialog from './edit.dialog.vue'
  import RegisterDialog from './register.dialog.vue'
  import TagDialog from './tag.dialog.vue'
  import TimeDialog from './time.dialog.vue'
  import http from '../../../api/http'
  export default {
    data () {
      var model = {testStatus:0};
      return {
        hospitalStatusList: [{
          value: 0,
          label: '-'
        }, {
          value: 1,
          label: '入院 '
        }, {
          value: 2,
          label: '出院'
        }],
        // 显示实验状态
        testList: [{
          value: 0,
          label: '-'
        }, {
          value: 1,
          label: '试验中 '
        }, {
          value: 2,
          label: '已完成'
        },{
          value: 3,
          label: '已退出'
        }],
        loading: true,
        form: {
          filter: {kwd: '', sort: {create_datetime: 'desc'}},
          pageNo: 1,
          pageSize: 10
        },
        status: ["", ""],
        active: ["禁用", "启用"],
        id: null,
        subjectId: null,
        subjectNum: null,
        dialogData: {show: false},
        editDialog: {show: false},
        registerDialog: {show: false},
        tagDialog: {show: false},
        timeDialog: {show: false},
        dialogVisiblesf: false,//
        dialogVisiblesx: false,//
        afbeData:{},
        sf:{
            type:"after",
            subid:""
            },
        sx:{
            type:"before",
            subid:""
            },
        seeLabId:'',
        visitDialog:{show:false},
        numDialog:{show:false},
        page: {},
        currentSubjectId: '',
        currentFinger:'',
        timeList: [],
        projectId:null,
        currentStatus:null,
        sex:null,
        subTime:null,
        name:null,
        multipleSelection: []
      }
    },
    computed: {},
    methods: {
      colsess(){
        var vm=this;
        vm.dialogVisiblesx=false;
        vm.dialogVisiblesf=false;
        vm.afbeData={};
      },
      opensf(id){
        var vm=this;
        vm.sf.subid=id;
        http.postData(vm, '/lib/Ocr/allinfo', vm.sf, function (resp) {
                if(resp.body.code=="111"){

                    vm.afbeData=resp.body.value;
                    vm.dialogVisiblesf=true;
                }else{
                  alert("未录入");
                }

              });
        
      },
      opensx(id){
        var vm=this;
        vm.sx.subid=id;
         http.postData(vm, '/lib/Ocr/allinfo', vm.sx, function (resp) {
                // console.log(resp);
                if(resp.body.code=="111"){
                    vm.afbeData=resp.body.value;
                    vm.dialogVisiblesx=true;
                }else{
                  alert("未录入");
                }
              });
        
      },
      handleClose(done) {
        
            var vm=this;
            vm.dialogVisiblesx=false;
            vm.dialogVisiblesf=false;
            vm.afbeData={};
         
      },
      //批量修改筛选者状态
      changeSubjectActives() {
        var vm = this;
        // console.log(vm.multipleSelection)
        if (vm.multipleSelection.length) {
          vm.$confirm('此操作将批量更改筛选者状态, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            var projectId = null;
            if (vm.multipleSelection != null && vm.multipleSelection.length > 0) {
              vm.editClick = true;
              var ids = new Array();
              vm.multipleSelection.forEach(function (o) {
                ids.push(o.id);
              });
              projectId = vm.$utils.getCurrenrProject().id;
              http.postData(vm, '/pt/candidateSubjects/changeAllSubject/' + projectId, {json: JSON.stringify(ids)}, function (resp) {
                vm.editClick = false;
                var ret = resp.body;
                if(ret.code == '111'){
                  vm.$message.success({message:ret.msg});
                  vm.onSubmit();
                }else{
                  vm.$message.error({message:ret.msg});
                }
                // 执行清空操作
                vm.$refs.multipleTable.clearSelection();
              });
            }
          }).catch(() => {
            // 执行清空操作
            vm.$refs.multipleTable.clearSelection();
          });
        } else {
          vm.$message.error('没有勾选项,请确认您的选择')
        }
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
       openNumDialogTable(row){
          this.sex = row.sex;
          this.subTime = row.passTime;
          this.name = row.name;
         this.subjectId = row.id;
          this.numDialog.show = true;
       },
      closeNumDialog(){
          this.numDialog.show = false;
      },
      openVisitDialogTable(row){
        this.subjectId = row.id;
        this.visitDialog.show = true;
      },
      closeVisitDialog(){
        this.visitDialog.show = false;
      },
      openTimeDialogTable(row){
        this.subjectId = row.id;
        this.subjectNum = row.num;
        this.projectId = row.projectId;
        this.timeDialog.show = true;
      },
      
      closeTimeDialogTable(){
        this.timeDialog.show = false
      },
      openTimeDialog(row){
        var vm = this;
        http.postData(vm, '/pt/process/queryProcessTimeLine/' + row.id+'-'+ this.$utils.getCurrenrProject().id, {}, function (resp) {
          var ret = resp.body;
          if (ret.code == '111') {
            vm.timeList = ret.value;
          }
        })
      },
      openTagDialog(row) {
        this.subjectNum = row.num;
        this.subjectId = row.id;
        this.tagDialog.show = true
      },
      closeTagDialog() {
        this.subjectId = null;
        this.tagDialog.show = false
      },
      openRegisterDialog(id,status,finger) {
        this.currentSubjectId = id;
        this.currentHospitalStatus = status;
        this.currentFinger = finger;
        this.registerDialog.show = true
      },
      closeRegisterDialog() {
        this.registerDialog.show = false
      },
      onSubmit (sortCol) {
        var vm = this;
        if (sortCol && sortCol.prop != undefined && sortCol.prop != '' && sortCol.prop != 'undefined') {
          var sortJson = '{"' + sortCol.prop + '":"' + (sortCol.order == 'descending' ? 'desc' : 'asc') + '"}';
          vm.form.filter.sort = JSON.parse(sortJson);
          vm.form.pageNo = 1;
        }
        vm.loading = true;
        if (vm.$utils.getCurrenrProject().id == null) {
          vm.$notify({title: '操作提示', message: '请选择项目', type: 'error'});
        }
        http.postData(vm, "/pt/subjects/page/" + this.$utils.getCurrenrProject().id, {
          json: JSON.stringify(vm.form.filter),
          pageNo: vm.form.pageNo,
          pageSize: vm.form.pageSize,
        }, function (resp) {
          var ret = resp.body;
          if (ret.code == '111') {
            // console.log(ret)
            vm.page = ret.value;
          }
          vm.loading = false;
        });
      },
      closeEditDialog() {
        this.editDialog.show = false;
      },
      openEditDialog(row) {
        this.currentSubjectId = row.id;
        this.$refs.child.comeGo(row.id);
        this.editDialog.show = true;
      },
     
      handleSizeChange () {
        this.form.pageNo = 1
        this.onSubmit()
      },
      handleCurrentChange (val) {
        this.form.pageNo = val
        this.onSubmit()
      }
    },
    components: {
      EditDialog,
      RegisterDialog,
      TagDialog,
      TimeDialog,
//      VisitDialog,
//      NumDialog
    },
    created() {
      this.onSubmit();
      var vm = this;
      http.postData(vm,'/pt/project/detail/' + vm.$utils.getCurrenrProject().id,{},function (resp) {
        var ret = resp.body;
        if(ret.code == 111){
          vm.currentStatus = ret.value.status;
        };
      });
    }
  }

</script>
<style>
</style>
